import React from 'react'
import {
  View,
  StyleSheet,
  Text
} from 'react-native'
import BasePage from 'src/pageP/base/base-page/index'
import JobPartTimeHeader from './components/JobPartTimeHeader'
import JobPartTimeBody from './components/JobPartTimeBody'
/* redux */
import {
  MyPostList
} from 'src/utils/RequestAPI'
import { connect } from 'react-redux'
import { DO_REQUEST_MAIN_PAGE_B_ACTION } from '@/pageB/main/main-page/store/action'
import CustomButton from '@components/button/CustomButton'
import LinearGradient from 'react-native-linear-gradient'
import { ScaleT, ScaleS } from 'src/utils/ScreenUtil'
import { DismissLoading, ShowLoading } from '../../../utils/ToastUtil'

const mapActiontoProps = dispatch => ({
  doRequestUserCompanyApplyApply (payload) {
    const promise = DO_REQUEST_MAIN_PAGE_B_ACTION(payload)
    dispatch(promise)
    return promise.payload
  }
})
@connect(
  ({ userinfo, mineCompanyStore, BMineCenterStore }) => ({
    userinfo,
    haveCompanyApply: BMineCenterStore.haveCompanyApply,
    ...mineCompanyStore
  }),
  mapActiontoProps
)
class JobPartTime extends BasePage {
  state = {
    header: {},
    initialPage: 0,
    data: [],
    type: 0
  }

  componentWillFocus () {

  }

  childRender () {
    const { data = {}, type } = this.state
    const typeList = ['发布兼职', '发布全职', '发布实习']
    return (
      <View style={styles.container}>
        <JobPartTimeHeader haveCompanyApply={this.props.haveCompanyApply} userinfo={this.props.userinfo} type={type} data={data} />
        <JobPartTimeBody haveCompanyApply={this.props.haveCompanyApply} userinfo={this.props.userinfo} jumpVip={this.jumpVip} getMyPostList={this.getMyPostList} type={type} jumpFn={this.jumpFn} data={data} />
        <LinearGradient style={styles.button} colors={['#EB427E', '#EC635C']}>
          <CustomButton style={styles.customButton} onPress={this.jumpFn}>
            <Text style={styles.buttonText}>{typeList[type]}</Text>
            <Text style={styles.buttonIcon}>+</Text>
          </CustomButton>
        </LinearGradient>
      </View>
    )
  }

  componentWillUnmount () {
    super.componentWillUnmount()
    const { userinfo: { userId } } = this.props
    this.props.doRequestUserCompanyApplyApply({ userId })
  }

  componentDidMount () {
    ShowLoading()
    const { navigation: { state: { params = {} } } } = this.props
    this.setState({
      type: params.type || 0
    })
    this.getMyPostList(params.type || 0, 0, 990)
  }

  prewClick = () => {
    console.log('prewClick')
  }

  jumpVip = () => {
    this.props.navigation.navigate('BMemberOpen')
  }

  jumpFn = (item) => {
    this.props.navigation.navigate('PartTimeRelease', { item, type: this.state.type, getMyPostList: this.getMyPostList })
  }

  getMyPostList = (type, limit, page) => {
    return new Promise((resolve, reject) => {
      MyPostList({ params: { limit, page, type }, headers: { companyId: this.props.haveCompanyApply.companyId } }).then((data) => {
        this.setState({
          data: data.data
        })
        DismissLoading()
        resolve(data)
      }).catch((e) => {
        DismissLoading()
        reject(e)
      })
    })
  }
}
export default JobPartTime
const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingBottom: ScaleS(40),
    backgroundColor: '#FFFFFF',
    height: '100%'
  },
  button: {
    position: 'absolute',
    height: ScaleS(60),
    width: '100%',
    bottom: ScaleS(0),
    justifyContent: 'center',
    alignItems: 'center',
    flexDirection: 'row'
  },
  customButton: {
    flexDirection: 'row'
  },
  buttonText: {
    color: '#fff',
    fontSize: ScaleT(24)
  },
  buttonIcon: {
    fontSize: ScaleT(16),
    color: '#fff',
    fontWeight: ('bold', '900'),
    marginTop: ScaleS(0),
    marginLeft: ScaleS(5)
  }
})
